<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>源码大数据-API详情页</title>

    <!-- 引入样式表: 注意引入顺序  样式重置表   公用样式 第三方样式表 当前页面样式表 -->
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="./css/api-details.css">
</head>

<body>
    <!-- 1.头部 -->
    <header class="abs">
        <!-- logo -->
        <img src="./imgs/new-logo-white2.png" alt="源码数据" class="logo fl mt20 ml30">
        <!-- 导航 -->
        <ul class="nav abs font14">
            <li><a href="#">首页</a></li>
            <li class="active"><a href="#">API</a></li>
            <li><a href="#">案例</a></li>
        </ul>
        <!-- 登录和注册 -->
        <div class="right-box fr mt20 mr30 font12">
            <a href="#">登录</a><a href="#" class="register">注册有礼</a>
        </div>
    </header>
    <!-- banner -->
    <div class="banner">
        <div id="mydiv" style="height:350px;"></div>

        <!-- 详情标题部分-->
        <div class="container clearfix abs title-box">
            <!-- 左边 -->
            <div class="title-left fl tcenter">
                <img src="./imgs/API11.jpg" alt="" class="smallImg">

                <ul>
                    <li>
                        <img src="./imgs/API_smallicon_01.jpg" alt="">
                        <p>132</p>
                    </li>
                    <li>
                        <img src="./imgs/API_smallicon_02.jpg" alt="">
                        <p>13233</p>
                    </li>
                    <li>
                        <img src="./imgs/API_smallicon_03.jpg" alt="">
                        <p>1232</p>
                    </li>
                </ul>
            </div>
            <!-- 右边 -->
            <div class="title-right fr">
                <!-- 标题 -->
                <div class="clearfix">
                    <h2 class="fl font20 c6e">身份证实名认证</h2>
                    <span class="fl tips">支持HTTPS</span>
                    <span class="fl tips">企业专用</span>
                </div>
                <!-- 企业要求 -->
                <div class="mtb10">
                    <span  class="orange mr30">
                        <img src="./imgs/API03.jpg" alt="">
                        限企业实名用户使用
                    </span>
                    <span  class="orange mr30">
                        <img src="./imgs/API08.jpg" alt="">
                        限企业实名用户使用
                    </span>
                    <span class="orange mr30">
                        <img src="./imgs/API05.jpg" alt="">
                        限企业实名用户使用
                    </span>
                </div>

                <!-- 提供的信息 -->
                <p class="c6">检测输入的姓名、手机号码、身份证号码、银行卡号是否一致</p>

                <!-- 价格 -->
                <ul id="apiDetails" class="clearfix font12">
                    <li class="default">
                        <img src="./imgs/API17.jpg" alt="">
                        扫码测试
                        <div class="qrcode tcenter abs">
                            <img src="./imgs/103-demo.png" alt="">
                            <p class="c6">扫我呀！</p>
                        </div>
                    </li>
                    <!-- <li class="default-li active">4000次</li>
                    <li class="default-li">8000次</li>
                    <li class="default-li">12000次</li> -->
                </ul>
                <!-- 价格细节 -->
                <div class="font12 c6">
                    <span class="red font16">&yen;
                        <span id="timesBox">4000</span>
                    </span>
                    <span id="priceBox">0.3000</span>元/次),限企业实名用户使用
                </div>
                <!-- 申请 -->
                <a href="#" class="tcenter mt30">立即申请</a>
            </div>
        </div>
    </div>
    <!-- 内容部分 -->
    <div class="""container">
        <div id="cantent">
           
        </div>
    </div>
    <footer>

    </footer>
    <!-- 引入jquery库 -->
    <script src="./lib/jquery-1.11.3/jquery.min.js"></script>

    <!-- 引入粒子效果库 -->
    <script src="./lib/canvas-particle.js"></script>
    <!-- 引入辅助工具 -->
    <script src="./lib/utils.js"></script>
    <!-- 配置插件 -->
    <script src="./js/api-details.js"></script>


</body>

</html>